<!--
 * @Author: 吴竹叶 2107206923@qq.com
 * @Date: 2023-09-28 08:58:56
 * @LastEditors: 胡威 3749920422@qq.com
 * @LastEditTime: 2024-04-03 15:34:29
 * @FilePath: \BZ_JT_AnQuanHuanBaoGuanLiApp\src\views\staging\commom\enterprise\components\fireFighting.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div>
    <custom-title :is-line="true" title="企业消防信息" />
    <div class="qyxfxx">
      <div v-for="(item, index) in descList" :key="index + 'base'">
        <custom-details-item :icon="item.icon" :label="item.label" :value="item.value" />
      </div>
    </div>
    <custom-title :is-line="true" title="消防安全基本情况" />
    <div class="xfaqjbqk">
      <div v-for="(item, index) in fireBaseInfoList.slice(0,5)" :key="index + 'baseSafe'">
        <custom-details-item :icon="item.icon" :label="item.keyname" :value="item.valcount" />
      </div>
    </div>
    <custom-title :is-line="true" title="消防安全管理情况" />
    <div class="sfaqglqk">
      <div v-for="(item, index) in fireBaseInfoList.slice(5)" :key="index + 'baseManage'">
        <custom-details-item :icon="item.icon" :label="item.keyname" :value="item.valcount" />
      </div>
    </div>
  </div>
</template>

<script>
import { companyInfoFireFighting } from '@/api/enterprise'

export default {
  name: 'FireFightingComponent',
  inject: ['layout'],
  props: {
    companyId: {
      type: [String, Number],
      default: ''
    }
  },
  data() {
    return {
      companyName: '',
      descList: [
        {
          label: '监管类型',
          icon: '&#xe6f7;',
          value: '',
          fieldName: 'supervisoryLevel'
        },
        {
          label: '消防安全管理人',
          icon: '&#xe700;',
          value: '',
          fieldName: 'fireHead'
        },
        {
          label: '联系电话',
          icon: '&#xe60a;',
          value: '',
          fieldName: 'fireHeadPhone'
        },
        // {
        //   label: '消防管理人员数量',
        //   value: '',
        //   fieldName: 'firePersonNum'
        // },
        {
          label: '有无消防力量',
          value: '',
          icon: '&#xe765;',
          fieldName: 'isFirePower'
        },
        {
          label: '是否森林火险单位',
          icon: '&#xe790;',
          value: '',
          fieldName: 'isFireKeynote'
        }
      ],
      fireBaseInfoList: []
    }
  },
  mounted() {
    this.companyInfoFireFighting()
  },
  methods: {
    // 获取企业详情数据--基本信息
    async companyInfoFireFighting() {
      this.layout.showAreaLoading(['.qyxfxx', '.xfaqjbqk', '.sfaqglqk'])
      const { status, data } = await companyInfoFireFighting({ companyId: this.companyId })
      if (status === 0 && data) {
        this.companyName = data.companyName
        this.descList.forEach((v) => {
          v.value = data[v.fieldName] ? data[v.fieldName] : ''
        })
        this.fireBaseInfoList = data.fireBaseInfoList
        console.log(this.fireBaseInfoList.slice(0, 6))
      }
      this.layout.hideAreaLoading(['.qyxfxx', '.xfaqjbqk', '.sfaqglqk'])
    }
  }
}
</script>

<style scoped lang="scss">
.xfaqjbqk {
  min-height: 250px;
}
</style>
